<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        div {
            width: 426px;
            height: 130px;
            position: relative;
        }
        ul {
            position: absolute;
            right: 10px;
            bottom: 10px;
            opacity: 0.5;
        }
        li{
            width: 20px;
            height: 20px;
            border: 1px solid rgba(0,0,0,0.5);
            list-style-type: none;
            float: left;
            margin: 5px;
            text-align: center;
            background-color: white;
        }
        /*#d1{*/
        /*    position: absolute;*/
        /*    right: 150px;*/
        /*    bottom: 10px;*/
        /*    background-color: white;*/
        /*    text-align: center;*/
        /*}*/

        /*#d2{*/
        /*    position: absolute;*/
        /*    right: 110px;*/
        /*    bottom: 10px;*/
        /*    background-color: white;*/
        /*    text-align: center;*/
        /*}*/
        /*#d3{*/
        /*    position: absolute;*/
        /*    right: 70px;*/
        /*    bottom: 10px;*/
        /*    background-color: white;*/
        /*    text-align: center;*/
        /*}*/
        /*#d4{*/
        /*    position: absolute;*/
        /*    right: 30px;*/
        /*    bottom: 10px;*/
        /*    background-color: white;*/
        /*    text-align: center;*/
        /*}*/

    </style>
</head>
<body>
<div>
    <a href="#"><img src="adver-01.jpg" height="130" width="426"/></a>
    <ul>
        <li id="d1">1</li>
        <li id="d2">2</li>
        <li id="d3">3</li>
        <li id="d4">4</li>
    </ul>
</div>

</body>
</html>